<template>
	<view class="content">
		<view class="header flex-j-b">
			<view class="size-28 font-Bold">
				赠送数量
			</view>
			<view class="size-28 color-h font-Bold">
				账号余额：{{walletData.integral}}
			</view>
		</view>
		<view class="num-box flex-a-c">
			<input type="text" placeholder="请输入赠送数量" v-model="num" placeholder-style="color:#999999;font-size:24rpx"/>
			<text class="size-30" @click="enterall">全部赠送</text>
		</view>
		<view class="give-box">
			<text class="size-28 font-Bold">赠送手机号</text>
		</view>
		<view class="phone-box">
			<input type="text" placeholder="请输入手机号" v-model="phone" placeholder-style="color:#999999;font-size:24rpx"/>
		</view>
		<view class="section flex-column">
			<view class="give-box">
				<text class="size-28 font-Bold">赠送说明</text>
			</view>
			<view class="guize" v-html="content">
				
			</view>
		</view>
		<view class="foot_btn allbtn flexs" @click="$u.throttle(submit, 1000)">
			立即提交
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			walletData:{},
			num:"",
			phone:"",
			content:""
		};
	},
	onShow() {
		this.getwallet()
		this.wenzhanglist()
	},
	methods:{
		enterall(){
			this.num = Number(this.walletData.integral)
		},
		submit(){
			if(!this.phone){
				this.$u.toast('手机号不能为空')
				return;
			}
			let data = {
				num:this.num,
				phone:this.phone
			}
			this.$Request.post(this.$api.user.giveIntegral,data).then(res => {
				this.$u.toast(res.msg)
				this.getwallet()
				this.num = ""
				this.phone = ""
			});
		},
		getwallet(){
			this.$Request.get(this.$api.user.wallet).then(res => {
				this.walletData = res.data
			});
		},
		wenzhanglist(){
			let data = {
				id:15
			}
			this.$Request.get(this.$api.index.wenzhang,data).then(res => {
				this.content = res.data.content
			});
		},
	}
};
</script>

<style lang="scss" scoped>
	.content{
		min-height: 100vh;
		background: #F7F7F7;
		padding-top: 40rpx;
		.foot_btn{
			width: 710rpx;
			height: 88rpx;
			border-radius: 100rpx;
			margin: 0 auto;
			color: #000;
			font-size: 32rpx;
			margin-top: 332rpx;
		}
		.header{
			padding: 20rpx;
		}
		.section{
			margin-top: 70rpx;
			.guize{
				padding: 0 20rpx;
			}
		}
		.give-box{
			padding: 20rpx;
			margin-top: 20rpx;
			text{
				color: #333;
			}
		}
		.phone-box{
			padding: 0 20rpx;
			input{
				width: 710rpx;
				height: 50rpx;
				background: #FFFFFF;
				border: 1px solid #707070;
				padding:  0 20rpx;
				border-radius: 10rpx;
				box-sizing: border-box;
			}
		}
		.num-box{
			padding: 0 20rpx;
			input{
				width: 400rpx;
				height: 50rpx;
				background: #FFFFFF;
				border: 1px solid #707070;
				padding:  0 20rpx;
				border-radius: 10rpx;
				box-sizing: border-box;
			}
			text{
				color: #1290FF;
				margin-left: 30rpx;
			}
		}
	}
</style>